import QtQuick 2.4
import QtQuick.Controls 1.2

import VPlayApps 1.0

import QuickUdpSocket 1.0

Page {
  property var today: alldata[currentIndex]
  property int currentIndex: 0
  property int recvPort: 45455

  property var alldata: [
    {
      number: 123,
      temperature: 12, description: qsTr("Foggy"),
      status: [false, false, false],
      station: 11,
      target: 1,
      icon: IconType.reddit
    },
  ]

  UdpSocket {
    id: udpreceive
    onMessageReceive: {
      var cmd = msg.toString();
      console.log(cmd)
      var array = []
      for(var i = 0; i < cmd.length; i += 2) {
        array.push( parseInt(cmd.substr(i, 2), 16) )
      }

      var r_num = array[0]
      var r_type = array[1]
      var r_cmd = array[2]

      //检查有无这个编号的数据
      var check = false
      var index;
      for (var i = 0; i < alldata.length; i ++) {
        console.log(alldata[i].number)
        if (alldata[i].number === r_num) {
          check = true;
          index = i;
          break;
        }
      }
      console.log(alldata.length)
      if (!check) {
        alldata.push({
                       number: r_num,
                       status: [false, false, false],
                       station: 0,
                       target: 0,
                       icon: IconType.redditsquare
                     });
        robotsRepeater.model = alldata;
      }

      //设置接收时间
      //alldata[index].time = time();
    }
  }
  Component.onCompleted: {
      udpreceive.socketBind(recvPort);
  }


  // Background
  Rectangle {
    anchors.fill: parent

    gradient: Gradient {
      GradientStop {
        position: 0
        color: today.temperature < 20 ? "#1AD6FD" : "#FF5E3A"

        Behavior on color { ColorAnimation { duration: 1500 } }
      }
      GradientStop {
        position: 1
        color: today.temperature < 20 ? "#1D62F0" : "#FF2A68"

        Behavior on color { ColorAnimation { duration: 1000 } }
      }
    }
  }

  // Top content
  Column {
    anchors.horizontalCenter: parent.horizontalCenter
    y: dp(10)
    spacing: dp(10)

//    // Current time
//    AppText {
//      id: timeLabel

//      font.pixelSize: sp(14)
//      anchors.horizontalCenter: parent.horizontalCenter

//      Timer {
//        running: true
//        interval: 1000 * 30
//        triggeredOnStart: true
//        repeat: true
//        onTriggered: {
//          timeLabel.text = new Date().toLocaleTimeString(Qt.locale(), Locale.ShortFormat)
//        }
//      }
//    }

    // City
    AppText {
      text: "奥讯送餐"
      font.pixelSize: sp(22)
      anchors.horizontalCenter: parent.horizontalCenter
    }

  }

  // Robots list content
  Grid {
    id: robotsGrid

    anchors.horizontalCenter: parent.horizontalCenter
    y: dp(40)
    width: Math.min(parent.width - dp(20), dp(450))
    columns: 5

    property int selected: currentIndex

    Repeater {
      id: robotsRepeater
      model: alldata

      Column {
        width: bottomGrid.width / 5
        spacing: dp(5)

        IconButton {
          icon: modelData.icon
          anchors.horizontalCenter: parent.horizontalCenter
          size: dp(20)
          onClicked: {

            //console.log(index)
            currentIndex = selected = index
//            if (currentIndex < alldata.length - 1)
//              currentIndex++
//            else
//              currentIndex = 0
          }
        }
      }
    }
  }

    // Centered content
    Column {
      id: col
      //anchors.centerIn: parent
      y: dp(90)
      // Temperature
      Label {
        anchors.horizontalCenter: parent.horizontalCenter
        text: "站点设置："
        font.pixelSize: sp(20)
        color: "steelblue"
      }
      AppText {
        id: stationText

        property int station: today.station
        Component.onCompleted: text = station

        font.pixelSize: sp(22)
        anchors.horizontalCenter: parent.horizontalCenter

        onStationChanged: {
          var currentStation = parseInt(stationText.text)
          stationTimer.restart()
        }

        Timer {
          id: stationTimer
          interval: 40

          onTriggered: {
            // Check if we have to change the text
            var currentStation = parseInt(stationText.text)

            if (stationText.station > currentStation) {
              stationText.text = ++currentStation
              restart()
            }
            else if (stationText.station < currentStation) {
              stationText.text = --currentStation
              restart()
            }
          }
        }
      }

      // Description
      Label {
        anchors.horizontalCenter: parent.horizontalCenter
        text: "目标站点："
        font.pixelSize: sp(20)
        color: "steelblue"
      }
      AppText {
        id: descText
        text: today.target
        font.pixelSize: sp(28)
        anchors.horizontalCenter: parent.horizontalCenter

        Behavior on text {
          SequentialAnimation {
            NumberAnimation { target: descText; property: "opacity"; to: 0 }
            PropertyAction { }
            NumberAnimation { target: descText; property: "opacity"; to: 1 }
          }
        }
      }
    }


  // Robots list content
  Grid {
    anchors.centerIn: parent
    anchors.horizontalCenter: parent.horizontalCenter
    //y: dp(40)
    width: Math.min(parent.width - dp(20), dp(450))
    columns: 3

    Repeater {
      model: [
        { icon: IconType.reddit, text: "1", code: 1  }, { icon: IconType.reddit, text: "2", code: 2  }, { icon: IconType.reddit, text: "3", code: 3  },
        { icon: IconType.reddit, text: "4", code: 4  }, { icon: IconType.reddit, text: "5", code: 5  }, { icon: IconType.reddit, text: "6", code: 6  },
        { icon: IconType.reddit, text: "7", code: 7  }, { icon: IconType.reddit, text: "8", code: 8  }, { icon: IconType.reddit, text: "9", code: 9  },
        { icon: IconType.reddit, text: "删除", type: "del", code: 16 }, { icon: IconType.reddit, text: "0", code: 0 }, { icon: IconType.reddit, text: "确定", code: 17 },
      ]

      Column {
        width: bottomGrid.width / 3
        spacing: dp(5)

        AppButton {
          text: modelData.text
          //icon: modelData.icon
          anchors.horizontalCenter: parent.horizontalCenter
          //flat: true
          fontBold: true
          onClicked: {

            var array = [0xAA, 0x78, 0x00, 0x00, 0xCC, 0x33, 0xC3, 0x3C];
            array[3] = modelData.code
            udpreceive.socketWrite(array.toString(), 45454);
          }
        }
      }
    }
  }



  // Bottom content
  Grid {
    id: bottomGrid

    width: Math.min(parent.width - dp(20), dp(450))
    anchors.horizontalCenter: parent.horizontalCenter
    y: parent.height - height - dp(10)
    columns: 5

    Repeater {
      model: today.status
//      [
//        { day: Qt.locale().dayName(0, Locale.ShortFormat), high: 34, low: 24, icon: IconType.suno },
//        { day: Qt.locale().dayName(1, Locale.ShortFormat), high: 32, low: 20, icon: IconType.suno },
//        { day: Qt.locale().dayName(2, Locale.ShortFormat), high: 33, low: 20, icon: IconType.suno },
//        { day: Qt.locale().dayName(3, Locale.ShortFormat), high: 28, low: 21, icon: IconType.suno },
//        { day: Qt.locale().dayName(4, Locale.ShortFormat), high: 24, low: 16, icon: IconType.suno }
//      ]

      Column {
        width: bottomGrid.width / 5
        spacing: dp(5)

        Icon {
          icon: modelData ? IconType.smileo : IconType.bomb
          anchors.horizontalCenter: parent.horizontalCenter
          size: dp(20)
        }

        Item {
          width: 1
          height: dp(5)
        }

        AppText {
          id: alertText
          //property int stat: modelData
          text: modelData ? qsTr("正常") : qsTr("报警")
          anchors.horizontalCenter: parent.horizontalCenter
          font.pixelSize: sp(14)
          //color: modelData ? "#aaffffff" : "#aaff00ff"
          Behavior on text {
            SequentialAnimation {
              NumberAnimation { target: alertText; property: "opacity"; to: 0 }
              PropertyAction { }
              NumberAnimation { target: alertText; property: "opacity"; to: 1 }
            }
          }
        }
      }
    }
  }

//  Timer {
//    interval: 3500
//    repeat: true
//    running: true
//    onTriggered: {
//      if (currentIndex < alldata.length - 1)
//        currentIndex++
//      else
//        currentIndex = 0
//    }
//  }
}
